*{
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}
.clearfix::after{
    display: block;
    content: "";
    clear: both;
    height: 0;
}
.content{
    width: 1190px;
    margin: 0 auto;
    // background-color: rgb(255, 123, 0);
}
// 头部区域
// #head{
//     width: 100%;
//     height: 36px;
//     background-color: #f5f5f5;
//     .left{
//         float: left;
//         position: relative;
//         li{
//             float: left;
//             text-align: center;
//             line-height: 36px;
//             margin-right: 36px;
//             a{
//                 font-size: 11px;
//                 color: #666;
//             }
//         }
//         img{
//             position: absolute;
//             top: 10px;
//             left: 335px;
//         }
//     }
//     .right{
//         float: right;
//         position: relative;
//         li{
//             float: left;
//             text-align: center;
//             line-height: 36px;
//             margin-right: 25px;
//             a{
//                 font-size: 11px;
//                 color: #666;
//             }
           
//         }
//         .red a{
//             color: red;
//         }
        
//         img{
//             position: absolute;
//             top: 13px;
//             right: 295px;
//         }
//     }
//   }
//   搜索区域
  #search{
      height: 110px;
      img{
          margin-top: 34px;
          float: left;
      }
     .form{
        margin-left: 20px;
        float: left;
        margin-top: 34px;
        width: 542px;
        height: 40px;
        background-color: #ff8000;
        border-radius: 11px;
        input{
            width: 420px;
            height: 36px;
            border: 2px solid #ff8000;
            outline: none;
            float: left;
            border-top-left-radius: 10px;
            border-bottom-left-radius: 10px;
        }
        button{
            width: 118px;
            height: 40px;
            background-color: #ff8000;
            color: #fff;
            font-weight: bold;
            border: 1px solid #ff8000;
            float: right;
            border-top-right-radius: 10px;
            border-bottom-right-radius: 10px;
        }
     }
  }
//   导航区域
#nav{
    height: 38px;
    .left{
        width: 200px;
        height: 38px;
        float: left;
        background-color: #ff8000;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        img{
            margin-left: 12px;
           line-height: 38px;
        }
        span{
            display: inline-block;
            margin-left: 7px;
            line-height: 38px;
            color: #fff;
        }
    }
    .conten{
        float: left;
        width: 780px;
        height: 38px;
        ul{
            margin-left: 17px;
            li{
                float: left;
                margin-right: 30px;
                line-height: 38px;
                font-weight: bold;
                font-size: 13px;
                &:hover{
                   font-size: 21px;
                   color: red;
                }
            }
        }
    }
    .right{
        width: 200px;
        height: 38px;
        float: left;
        background-color: #4a4a48;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        span{
            display: inline-block;
            margin-left: 25px;
            line-height: 38px;
            color: #e9cc91;
        }
    }
}
// 轮播区
#banner{
    height: 478px;
    background-color: #840c0e;
    .left{
        width: 200px;
        height: 478px;
        background-color: #fff;
        float: left;
        ul{
            padding-top: 11px;
            li{
                font-size: 12px;
                margin-bottom: 14px;
                img{
                    margin-right: 10px;
                }
            }
        }
    }
    .conten{
        width: 780px;
        height: 478px;
        float: left;
        position: relative;
        background-color: #e9cc91;
        .swiper {
            width: 780px;
            height: 478px;
            img{
                width: 780px;
                height: 478px;
            }
        }
        .select{
            width: 780px;
            height: 239px;
            background-color: aquamarine;
            opacity: 0.5;
            position: absolute;
            top: 0;
            display: none;
            font-size: 35px;
            color: blue;
            font-weight: 700;
            text-align: center;
            line-height: 239px;
           
        }
    }
    .right{
        width: 200px;
        height: 478px;
        background-color: #fff;
        float: left;
        .top{
            width: 200px;
            img{
                width: 46px;
                height: 46px;
                margin-top: 10px;
                margin-left: 10px;
                float: left;
            }
            span{
                display: inline-block;
                font-size: 10px;
                margin-top: 18px;
                margin-left: 8px;
            }
            button{
                font-size: 12px;
                border: none;
                margin-left: 8px;
                margin-top: 12px;
            }
        }
        .buttom{
            width: 200px;
            p{
                width: 156px;
                height: 24px;
                margin-top: 12px;
                background-color: #ff8000;
                border-radius: 5px;
                text-align: center;
                margin-left: 20px;
            }
        }
        .dl{
            .first{
                margin-top: 10px;
            }
            dl{
                float: left;
                width: 65px;
                height: 85px;
                text-align: center;
            }
        }
    }
}
// 物品推荐区
#recommend{
    margin-top: 10px;
    background-color: #f2f2f2;
    // margin:10px auto;
    .content div{
        width: 228px;
        height: 350px;
        background-color: rgb(250, 250, 250);
        float: left;
        margin-right: 10px;
        margin-bottom: 10px;
        display: flex;
        flex-direction: column;
        align-items: center;
        img{
            width: 228px;
            height: 230px;
        }
        .as{
            font-size: 15px;
            color: rgb(95, 94, 98);
            margin-top: 14px;
            margin-left: 14px;
            width: 193px;
            overflow: hidden;
            text-overflow: ellipsis; 
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            
        }
        .money{
            margin-top: 27px;
            margin-left: -13px;
            font-size: 28px;
            font-weight: bold;
            color: #ff3300;
            span{
                font-size: 24px;
            }
        }
    }
    .last{
        margin-right: 0;
    }
    .look{
        // float: left;
        // width: 150px;
        // height: 30px;
        // background-color: #ff3300;
        color: #f5f5f5;
        font-weight: bold;
        font-size: 15px;
       text-align: center;
       line-height: 30px; 
        border-radius: 10px;
        margin: 0 auto;
    }
}
hr{
    font-weight: bold;
    margin-top: 10px;
}
// 页尾
#footer{
    height: 100px;
    .guarantee div{
        width: 162px;
        height: 100px;
        margin-left: 34px;
        margin-right: 40px;
        float: left;
        img{
            width: 47px;
            height: 47px;
            float: left;
            margin-top: 12px;
        }
        p{
            margin-top: 18px;
            margin-left: 56px;
            margin-bottom: 13px;
            font-size: 12px;
            color: #333;
        }
        span{
            margin-left: 7px;
            font-size: 12px;
            color: #545454;
        }
    }
}
// 页尾2
// #foot{
//     height: 185px;
//     margin-top: 10px;
//     background-color: #f5f5f5;
//     ul{
//         float: left;
//         margin-right: 145px;
//         li{
//             font-size: 12px;
//             color: #545454;
//             margin-bottom: 11px;
//         }
//         li:nth-child(1){
//             margin-bottom: 15px;
//             font-size: 14px;
//             color: #545454;
//             font-weight: bold;
//         }
//         li:last-child{
//             margin-bottom: 0;
//         }
//     }
//     .content div{
//         float: left;
//         span{
//             display: inline-block;
//             margin-bottom: 15px;
//             font-size: 14px;
//             color: #545454;
//             font-weight: bold;
//         }
//         p{
//             width: 84px;
//             font-size: 14px;
//             color: #333;
//             line-height: 18px;
//         }
//     }
// }
// 页脚
// #tail{
//     height: 200px;
//     p{
//         text-align: center;
//         margin-bottom: 14px;
//         font-size: 12px;
//         color:#999;
//         &:nth-child(1){
//            color: #333;
//            margin-top: 22px;
//         }
//         &:nth-child(2){
//             color: #333;
//          }
//     }
    
// }
